<template>
    <show-modal
        :title="info && info.roleInnerId ? '编辑' : '新增'+'部门'"
        :loading="loading"
        width="500px"
        @cancel="() => {$emit('cancel');}"
        @submit="submit"
    >
        <a-form-model :model="form" :rules="rules" v-bind="layout" ref="form">
            <a-form-model-item prop="deptName" label="组织名称">
                <a-input v-model.trim="form.deptName" placeholder="请输入组织名称" />
            </a-form-model-item>
            <!-- <a-form-model-item prop="deptCode" label="部门编码">
                <a-input v-model="form.deptCode" :disabled="form.deptId?true:false" placeholder="请输入部门编码" />
            </a-form-model-item> -->
            <a-form-model-item prop="parentId" label="上级组织">
                <a-tree-select
                    style="width: 100%"
                    v-model="form.parentId"
                    :dropdown-style="{ maxHeight: '400px', overflow: 'auto' }"
                    placeholder="请选择上级组织"
                    allow-clear
                    :replaceFields="replaceFields"
                    :tree-data="treeData"
                >
                </a-tree-select>
            </a-form-model-item>
            <a-form-model-item v-if="form.parentId==-1" prop="area" label="所在省市">
                <a-cascader
                    :fieldNames="{ label: 'name', value: 'name', children: 'children' }"
                    :options="areaData"
                    placeholder="请选择所在省市"
                    v-model="area"
                    @change="onChange"
                />
            </a-form-model-item>
            <!-- <a-form-model-item prop="orderNum" label="排序">
                <a-input-number class="form_item" v-model="form.orderNum" type="number" placeholder="请输入部门排序" />
            </a-form-model-item> -->
            <!-- <a-form-model-item label="状态">
                <a-switch :checked="form.status == 1 ? true : false" disabled @change="onChangeShow" />
            </a-form-model-item> -->
        </a-form-model>
    </show-modal>
</template>

<script>
import { addInfo,updateInfo } from '@/api/system/dept';
import { rules } from './rules';
import standardTree from '@/components/standardTree/index';
import {areaData} from '@/utils/area'

export default {
    name: 'roleModel',
    props: {
        info: {
            type: Object,
            default: () => {}
        },
        list:{
            type:Array,
            default:()=>[]
        }
    },
    components: { standardTree },
    data() {
        return {
            areaData,
            rules,
            form: {
                deptName:"",
                deptCode:'',
                status:1,
                area:'',
                parentId:'-1',
                orderNum:'',
            },
            loading: false,
            layout: {
                labelCol: { span: 5 },
                wrapperCol: { span: 19 }
            },
            replaceFields:{
                children:'children',
                title:'deptName',
                key:'deptId',
                value: 'deptId' 
            },
            treeData: [
                // {
                //     deptName: '浙江交工集团',
                //     deptId: '-1',
                //     children: [
                //         ...this.list
                //     ]
                // }
                ...this.list
            ],
            area:[]
        };
    },
    created(){
        let {area} = this.info;
        this.form = {...this.form,...this.info};
        if(area){
            this.area = area.split('/')
        }
    },
    methods: {
        //提交
        submit() {
            this.$refs.form.validate(async valid => {
                if (valid) {
                    try {
                        this.loading = true;
                        let form = this.form;
                        let res = null
                        if (form.deptId) {
                            //编辑
                            res = await updateInfo(form);
                        } else {
                            //新增addInfo
                            res = await addInfo(form);
                        }
                        let {code} = res;
                        if(code==200){
                            this.$message.success('操作成功!');
                            this.$emit('ok');
                        }
                    } finally {
                        this.loading = false;
                    }
                }
            });
        },
        //切换状态
        onChangeShow(checked) {
            if (checked) {
                this.form.status = 1;
            } else {
                this.form.status = 0;
            }
        },
        //选择省市
        onChange(item){
            this.form.area = item.join('/')
        }
    }
};
</script>
